<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jq</title>
	<script src="jquery.js"></script>
	
</head>
<style>
	
</style>


<body>

	<div class="div1">
		<h1>aaaaaaaaaaaaaaaaaa</h1>
		<h1>bbbbbbbbbbbbbbbbbb</h1>
		<div class="div11">
			<h1>ccccccccccccccc</h1>
			<h1>ddddddddddddddd</h1>
			<p>sssssssssssssssssss</p>
		</div>
	</div>

	<h1>pppppppppppppp</h1>
	<h1>xxxxxxxxxxxxxx</h1>
</body>
<script>
	//祖先 后代  div1中所有h1后代
	//$('.div1 h1').css({'color':'#f00'}); //abcd行红色

	//父 子  父亲是div1，儿子是h1的所有内容
	//$('.div1>h1').css({'color':'#f00'});//ab行红色

	//前一个 后一个; div1同级的下一个h1
	//$('.div1+h1').css({'color':'#f00'});//p行红色

	//前一个 后边所有

	$('.div1~h1').css({'color':'#f00'});//px行红色

</script>
</html>